<template>
  <view style="display: flex; flex-direction: column; height: 100vh">
    <u-sticky>
      <u-navbar back-text=" " title="进/撤场" :background="background" title-color="#ffffff" :custom-back="customBack" back-icon-color="#ffffff" title-size="36"></u-navbar>
      <xmInfo
        :projectno="itemContent.projectno"
        :projectname="itemContent.projectname"
      ></xmInfo>
    </u-sticky>

	<view style="flex: 1;  overflow: scroll">
    <view class="cu-card dynamic">      
      <view
        class="margin jc-flex"
        v-if="Object.keys(jinCheChangData).length !== 0"
      >
        <view class="cu-list menu sm-border margin-top margin-bottom-sm">
          <view class="cu-item">
            <view class="content">
              <text class="text-grey text-xxl text-bold">进场</text>
            </view>
            <dictLabel
              :value="jinCheChangData.state ? jinCheChangData.state : 0"
              dict-type="zf_proj_jcsg_status"
              :dict-list="dictList"
              :fontSize="'36rpx'"
            ></dictLabel>
          </view>
        </view>
        <view class="cu-form-group">
          <view class="text-xl">通知进场日期</view>
          <view class="text-xl">{{ jinCheChangData.predate }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">确认进场日期</view>
          <view class="title">{{ jinCheChangData.approachdate }}</view>
        </view>
        <view class="cu-form-group">
          <view class="title">确认进场现场图片</view>
        </view>
        <view class="cu-form-group">
          <js-uploadfile
            maxCount="0"
            v-if="uploadFile"
            :biz-key="jinCheChangData.id"
            biz-type="pmApproachEN_image"
            :deletable="false" 
            customBtn="false"
          ></js-uploadfile>
        </view>
        <view class="cu-list menu sm-border margin-top margin-bottom-sm">
          <view class="cu-item">
            <view class="content">
              <text class="text-grey text-xxl text-bold">撤场</text>
            </view>
          </view>
        </view>
        <view>
          <view class="cu-form-group margin-top">
            <view class="text-xl">通知撤场日期</view>
            <view class="text-xl">{{
              jinCheChangData.prewithdrawdate
            }}</view>
          </view>
          <view class="cu-form-group">
            <view class="title">确认撤场日期</view>
            <view class="title">{{ jinCheChangData.withdrawdate }}</view>
          </view>
          <view class="cu-form-group">
            <view class="title">确认撤场现场图片</view>
          </view>
          <view class="cu-form-group">
            <js-uploadfile
              maxCount="0"
              v-if="uploadFile"
              :biz-key="jinCheChangData.id"
              biz-type="pmApproachEX_image"
              :deletable="false" 
              customBtn="false"
            ></js-uploadfile>
          </view>
        </view>
      </view>
      <view v-else>
        <u-empty
          mode="data"
          text="当前项目处于施工准备阶段，无进/撤场信息"
        ></u-empty>
      </view>
    </view>
    <view style="height: 80px"></view>
    <view
      class="btn-group cu-bar foot"
      v-if="
        jinCheChangData.state == vuex_config.STATUS_NOT ||
        jinCheChangData.state == vuex_config.STATUS_ENTZ ||
        jinCheChangData.state == vuex_config.STATUS_EN ||
        jinCheChangData.state == vuex_config.STATUS_EXTZ
      "
    >


      <button
        class="cu-btn text-green line-green shadow"
        @tap="showModal(status)"
        v-if="(jinCheChangData.state == vuex_config.STATUS_NOT || jinCheChangData.state == vuex_config.STATUS_ENTZ) && status == vuex_config.STATUS_ENTZ && jcqrFlag"
      >
        确认进场
      </button>
      <button
        class="cu-btn bg-blue shadow-blur"
        @click="DateChange(status)"
        v-if="jinCheChangData.state == vuex_config.STATUS_EN  && status == vuex_config.STATUS_EN &&(jcFlag || ccFlag)"
      >
        撤场通知
      </button>
      
      <button
        class="cu-btn text-green line-blue shadow"
        @tap="showModal(status)"
        v-if="jinCheChangData.state >= vuex_config.STATUS_EXTZ  && status == vuex_config.STATUS_EXTZ && ccqrFlag"
      >
        确认撤场
      </button>
    </view>


    <view
      class="btn-group cu-bar foot"
      v-else-if="Object.keys(jinCheChangData).length == 0 && status == vuex_config.STATUS_NOT &&(this.jcFlag || this.ccFlag)"
    >
      <button class="cu-btn bg-green shadow-blur" @click="DateChange(status)">
        进场通知
      </button>
    </view>
    <!-- 使用uView的u-popup组件作为弹出容器 -->
    <!-- <u-popup v-model="isPopupShow" @close="closeDatePicker">
			
		</u-popup> -->
    <u-picker
      mode="time"
      v-model="isPopupShow"
      :params="params"
      @confirm="confirmPicker"
    ></u-picker>
    <!--  -->
    <bottom-form
      :modalName="modalName"
      @modalNameEmit="modalNameEmit"
      :bizType="bizType"
      :bizKey="bizKey"
      @fdData="fdData"
      v-if="modalName == 'bottomModal'"
    ></bottom-form>
  </view>
  </view>
</template>

<script>
import bottomForm from "./bottomForm.vue"
import xmInfo from "@/pages/zfgs/index/componetns/xmInfo.vue";
import dictLabel from "@/pages/zfgs/index/componetns/dictLabel.vue";
import {hasPermission} from '@/common/fire.js'
export default {
  components: {
    bottomForm,
    xmInfo,
    dictLabel,
  },
  data() {
    return {
      background:{
        backgroundColor: '#3E97B0',
      },
      currentImageUrl: "",
      jinChangNotify: true,
      jinChangStatus: false,
      isPopupShow: false,
      selectedDate: new Date(), // 当前日期
      params: {
        year: true,
        month: true,
        day: true,
      },
      modalName: null,
      jinChangData: {
        noticeDta: "2024-03-11",
        confirmData: "2024-03-12",
      },
      jinCheChangData: {},
      itemContent: {},
      dictList: [],
      bizType: "",
      bizKey: "",
      uploadFile:false,
      status: "", //状态判断,
      jcFlag: hasPermission('proj:enex:pmApproach:sendEn'),
      ccFlag: hasPermission('proj:enex:pmApproach:sendEx'),
      jcqrFlag: hasPermission('proj:enex:pmApproach:validEn'),
      ccqrFlag: hasPermission('proj:enex:pmApproach:validEx'),
    };
  },
  created() {
    console.log(uni.$u.config.v);
  },
  onLoad(e) {
    console.log(e,'e.item===')
    if (typeof e.item !== "undefined") {
      
      try {
        this.itemContent = JSON.parse(e.item);
        console.log(this.itemContent);
        this.getDictList();
        this.getJinCheChang();

        this.uploadFile = true;
        this.status = e.status;
        console.log(this.status,'status----');
        setTimeout(() => {
          this.bizKey = this.jinCheChangData.id;
        }, 500);
      } catch (error) {
        console.error("Failed to parse item:", error);
      }
    } else {
      console.warn("Item is undefined.");
    }
  },

  methods: {
    customBack(){
      // 跳转到工作台页面
      // uni.navigateTo({
      //   url: "/pages/zfgs/index/index/index?item=" + JSON.stringify(this.itemContent),
      // });
	  uni.navigateBack({
	    delta: 1,
	  });
    },
    fdData(e) {
      const { fdData, approachdate } = e;
      console.log(this.jinCheChangData.state,'state');
      if (this.jinCheChangData.state == 4) {
        const params = {
          id: this.jinCheChangData.id,
          name: this.itemContent.projectname,
          pcode: this.itemContent.projectno,
          withdrawdate: approachdate,
          ...fdData,
        };
        this.$u.api.zfgs.enexPmApproachValidEx(params).then((res) => {
          if (res.result == "true") {
            this.getJinCheChang();
            this.$u.toast(res.message);
          } else {
            this.$u.toast(res.message);
          }
        });


      } else {
        const params = {
          id: this.jinCheChangData.id,
          name: this.itemContent.projectname,
          pcode: this.itemContent.projectno,
          approachdate: approachdate,
          ...fdData,
        };
        this.$u.api.zfgs.enexPmApproachValidEn(params).then((res) => {
          if (res.result == "true") {
            this.getJinCheChang();
            this.$u.toast(res.message);
          } else {
            this.$u.toast(res.message);
          }
        });
      }
    },
    getDictList() {
      this.$u.api
        .dictListData({ dictType: "zf_proj_jcsg_status" })
        .then((res) => {
          this.dictList = res;
        });
    },
    getJinCheChang() {
      this.$u.api.zfgs
        .enexPmApproachListData({
          name: this.itemContent.projectname,
          pcode: this.itemContent.projectno,
        })
        .then((res) => {
          if (res.list && res.list.length > 0) {
            this.jinCheChangData = res.list[0];
            console.log(this.jinCheChangData,'this.jinCheChangData');
            this.uploadFile = false
            setTimeout(() => {
              this.uploadFile = true
            }, 500);
          }
        });
    },
    // 点击DateChange，弹出日期选择器
    DateChange(status) {
      this.isPopupShow = true; // 显示日期选择器
    },
    closeDatePicker() {
      this.isPopupShow = false; // 关闭日期选择器
    },
    confirmPicker(e) {
      // this.selectedDate = e;
      console.log(e);
      // this.$u.toast('您选中了日期：' + e.year + '年' + e.month + '月' + e.day + '日');
      this.jinChangStatus = true;
      this.jinChangNotify = false;
      console.log(this.jinCheChangData, "jinCheChangData");
      if (this.jinCheChangData.state == 2) {
        this.$u.api.zfgs
          .enexPmApproachSengExMsg({
            id: this.jinCheChangData.id,
            pcode: this.itemContent.projectno,
            name: this.itemContent.projectname,
            prewithdrawdate: e.year + "-" + e.month + "-" + e.day,
          })
          .then((res) => {
            console.log(res);
            if (res.result == "true") {
              this.getJinCheChang();
              this.$u.toast(res.message);
            } else {
              this.$u.toast(res.message);
            }
          });
      } else {
        this.$u.api.zfgs
          .enexPmApproachSengEnMsg({
            pcode: this.itemContent.projectno,
            name: this.itemContent.projectname,
            predate: e.year + "-" + e.month + "-" + e.day,
          })
          .then((res) => {
            console.log(res, "res");
            if (res.result == "true") {
              this.getJinCheChang();
              this.$u.toast(res.message);
            } else {
              this.$u.toast(res.message);
            }
          });
      }

      // this.$u.toast("通知成功");
    },
    showModal(status) {
      if (this.jinCheChangData.state == this.vuex_config.STATUS_EXTZ) {
        this.bizType = "pmApproachEX_image";
      } else {
        this.bizType = "pmApproachEN_image";
      }

      this.modalName = "bottomModal";
    },

    modalNameEmit(e) {
      this.modalName = e;
    },
  },
};
</script>

<style lang="scss" scoped>
.cu-bar {
  min-height: 80px;
}
.cu-btn {
  font-size: 16px;
  height: 40px;
}
.foot {
  z-index: 997;
  background: #fff;
}
.cu-item {
  flex-wrap: wrap;
  padding: 15px !important;
}
.text-grey {
  color: #000;
}
.jc-flex {
  border-radius: 60rpx;
  font-size: 30rpx;
}
</style>
